<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <!-- <link rel="icon" type="image/svg+xml" href="/vite.svg" /> -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title> React TS</title>
    <script type ="text/javascript" src="./public/glMatrix-0.9.6.min.js"></script>
    <script id="shader-vs" type="x-shader/x-fragment">
        
      attribute   vec3    v3Position;
      
      uniform     mat4    proj;
      uniform     float   angle;
      
      void main(void)
      {
          gl_PointSize =   6.0;
          float x = length(v3Position) * cos(angle);
          float y = length(v3Position) * sin(angle);
          gl_Position =   proj * vec4(v3Position.x + x,v3Position.y + y,v3Position.z, 1.0);
      }
  </script>

  <script id="shader-fs" type="x-shader/x-fragment">
      precision   mediump     float;
      uniform     sampler2D   texture;
      void main(void)
      {
          vec4    color   =   texture2D(texture, gl_PointCoord);
          if(color.a < 0.1)
              discard;
          gl_FragColor = color;
      }
  </script>

  <script id="shader-vs-cut" type="x-shader/x-fragment">
        
    attribute   vec3    v3Position;
    attribute   vec4    inColor;
    attribute   vec2    inUV;
    attribute   vec3    inNormal;
    uniform     mat4    proj;
    uniform     mat3    normalMat;
    uniform     mat4    mvMat;
    uniform     vec3    lightPos;
    uniform     vec3    ambientColor;
    uniform     vec3    lightColor;
    varying     vec4    outColor;
    varying     vec2    outUV;

    void main()
    {
        vec4    mvPosition          =   mvMat * vec4(v3Position, 1.0);
        vec3    lightDir            =   normalize(lightPos - mvPosition.xyz);
        vec3    transformedNormal   =   normalMat * inNormal;
        float   lightWeight         =   max(dot(transformedNormal, lightDir), 0.0);
       
        gl_Position =   proj * vec4(v3Position, 1.0);
        outColor    =   inColor * vec4(ambientColor + lightColor * lightWeight,1.0);
        outUV       =   inUV;
    }
</script>

<script id="shader-fs-cut" type="x-shader/x-fragment">
    precision   mediump float;
    varying     vec4        outColor;
    varying     vec2        outUV;
    uniform     sampler2D   texture;
    void main(void)
    {
        gl_FragColor = outColor * texture2D(texture,outUV);
    }
</script>

<script id="vertex-shader_five" type="x-shader/x-vertex">
  attribute vec4 vPosition;
    uniform vec4 vColor;
    varying vec4 fColor;
    void
    main() {
      gl_Position = vPosition;
      fColor = vColor;
    }
</script>
<script id="fragment-shader_five" type="x-shader/x-fragment">
  precision mediump float;
  varying vec4 fColor;
  void main()
  {
    gl_FragColor = fColor;
  }
</script> 
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>
